/*
 * @author zei, QQ:77132995, email:kazeik@163.com
 * 2021/12/8 14:52
 * 类说明:
 */

import 'package:flutter/material.dart';
import 'package:image_scan_crop/utils/Utils.dart';
import 'package:photo_view/photo_view.dart';

class ZoomViewPage extends StatelessWidget {
  const ZoomViewPage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text("View缩放"),
      ),
      body: PhotoView.customChild(
        child: Container(
          margin: const EdgeInsets.only(left: 10, top: 10),
          decoration: BoxDecoration(
            image: DecorationImage(
              image: AssetImage(
                Utils.getImgPath("ts", format: "jpg"),
              ),
            ),
          ),
          child: Stack(
            children: [
              Stack(children: [
                Positioned(
                  top: 30,
                  left: 100,
                  child: Container(
                    width: 100,
                    height: 30,
                    decoration: BoxDecoration(
                      border: Border.all(color: Colors.red),
                    ),
                    alignment: Alignment.center,
                    child: const Icon(
                      Icons.add_circle_outline,
                      color: Colors.white,
                    ),
                  ),
                ),
                Positioned(
                  top: 150,
                  left: 100,
                  child: Container(
                    width: 80,
                    height: 30,
                    decoration: BoxDecoration(
                      border: Border.all(color: Colors.yellow),
                    ),
                    alignment: Alignment.center,
                    child: const Icon(
                      Icons.add_circle_outline,
                      color: Colors.white,
                    ),
                  ),
                ),
                Positioned(
                  top: 70,
                  left: 20,
                  child: GestureDetector(
                    child: Container(
                      width: 140,
                      height: 30,
                      decoration: BoxDecoration(
                        border: Border.all(color: Colors.green),
                      ),
                      alignment: Alignment.center,
                      child: const Icon(
                        Icons.add_circle_outline,
                        color: Colors.white,
                      ),
                    ),
                    onTap: () {
                      Utils.showToast("msg");
                    },
                    onPanUpdate: (detail) {
                      Offset localPosition = Offset(detail.localPosition.dx,
                          detail.localPosition.dy); // 转换为局部坐标但实际是全局坐标
                      Offset globalPosition = Offset(detail.globalPosition.dx,
                          detail.globalPosition.dy); // 获得的是全局坐标。
                      Utils.logs(
                          "local : ${localPosition.dx} - ${localPosition.dy} | global = ${globalPosition.dx} - ${globalPosition.dy}");
                    },
                  ),
                ),
              ])
            ],
          ),
        ),
      ),
    );
  }
}
